/* * @module:views/budget/organization/downToUpSpaceDetails * @author:zengfx *
@date:2020-12-15 * 自下而上空间编制详情 */
<template>
    <div class="downToUpSpaceDetails_container">
        <div class="contentTopTitle">
            <div class="fl" style="display: flex;">
                <div class="title" style="height: 28px; line-height:28px;">查看编制 <el-button size="mini" style="margin-left: 15px;" @click="goBack() " >返回</el-button></div>
            </div>
        </div>
        <div class="tableBox">
            <el-table
                v-loading="tableLoading"
                :data="tableData"
                height="85vh"
                style="width: 100%"
                class="tableTh28"
                border
                stripe
                ref="table"
            >
                <el-table-column
                    v-for="(item, index) in title2"
                    :key="index"
                    :label="item.name"
                    min-width="100"
                    :prop="item.indexId"
                >
                    <el-table-column 
                        v-for="(it, ids) in item.children"
                        :key="ids"
                        :label="it.name"
                        min-width="90"
                        :prop="it.indexId"
                    >
                        <el-table-column
                            v-for="(itd, idd) in it.children"
                            :key="idd"
                            :label="itd.name"
                            min-width="100"
                            :prop="itd.indexId"
                        ></el-table-column>
                    </el-table-column>
                </el-table-column>

                <!-- <el-table-column
                    v-for="(item, index) in title3"
                    :key="index"
                    :label="item.label"
                    min-width="160"
                >
                    <el-table-column
                        v-for="(it, ids) in item.item"
                        :key="ids"
                        :label="it.label"
                        min-width="160"
                    >
                        <el-table-column
                            v-for="(itd, idd) in it.item"
                            :key="idd"
                            :label="itd.label"
                            min-width="160"
                        ></el-table-column>
                    </el-table-column>
                </el-table-column> -->
                <!-- <el-table-column
                    prop="hp040003"
                    label="县公司名称"
                    min-width="160"
                ></el-table-column>
                <el-table-column
                    prop="hp040004"
                    label="支局/政企中心名称"
                    min-width="160"
                ></el-table-column>
                <el-table-column
                    prop="hp040005"
                    label="去年收入（万元）"
                    min-width="160"
                ></el-table-column> -->
                <!-- <el-table-column
                    v-for="(item, index) in titleList"
                    :label="item.class1"
                    :key="index"
                >
                    <el-table-column :label="item.class2" min-width="160">
                        <el-table-column
                            :label="item.horizonIndexName"
                            min-width="160"
                            :prop="computedProp(index)"
                        ></el-table-column>
                    </el-table-column>
                </el-table-column> -->
            </el-table>
        </div>
    </div>
</template>

<script>
import { $budgetAPI } from "@/api";
import { mergeSpan } from "@/utils/mixin";
export default {
    data() {
        return {
            tableLoading: false,
            tableData: [],
            titleList: [],
            spanArr: [],
            titleList1: [],
            title2: [],
            title3: []
        };
    },
    mounted() {
        this.getInitData();
    },
    methods: {
        computedProp(index) {
            index += 3;
            var val = "";
            if (index < 10) {
                val = "hp04000" + index;
            } else {
                val = "hp0400" + index;
            }
            return val;
        },
        //table合并行
        arraySpanMethod({ row, column, rowIndex, columnIndex }) {
            if (this.tableData.length > 0) {
                if (columnIndex == 0) {
                    return (
                        this.spanArr.length &&
                        this.spanArr[rowIndex][columnIndex]
                    );
                }
            }
        },
        getInitData() {
            var that = this;

            this.tableLoading = true;
            var title2 = [];
            var title3 = [];
            $budgetAPI.getSpaceModelDataDetailList(
                { id: this.$route.query.detailId },
                res => {
                    if (res.code == 0) {
                        // var ss = [
                        //     {
                        //         label: "一级标题1",
                        //         item: [
                        //             {
                        //                 label: "二级标题1",
                        //                 item: [
                        //                     {
                        //                         label: "三级标题1",
                        //                         prop: "value1"
                        //                     },
                        //                     {
                        //                         label: "三级标题2",
                        //                         prop: "value2"
                        //                     },
                        //                     {
                        //                         label: "三级标题3",
                        //                         prop: "value3"
                        //                     },
                        //                     {
                        //                         label: "三级标题4",
                        //                         prop: "value4"
                        //                     },
                        //                     {
                        //                         label: "三级标题5",
                        //                         prop: "value5"
                        //                     }
                        //                 ]
                        //             },
                        //             { label: "二级标题1", prop: "value6" },
                        //             { label: "二级标题2", prop: "value7" },
                        //             { label: "二级标题3", prop: "value8" },
                        //             { label: "二级标题4", prop: "value9" },
                        //             { label: "二级标题5", prop: "value10" }
                        //         ]
                        //     },
                        //     { label: "一级标题2", prop: "value11" }
                        // ];
                        

                        for (var i = 0; i < res.content.titles1.length; i++) {
                            var cur = res.content.titles1[i];
                            if(cur.children.length == 1) {
                                console.log(cur.children)
                                cur.indexId = cur.children[0].children[0].indexId;
                                cur.children = [];
                             
                            }
                            if (cur.children.length > 1) {
                                for(var j = 0; j < cur.children.length; j++) {
                                    var secCur = cur.children[j];
                                    if(secCur.children.length == 1) {
                                        secCur.indexId = secCur.children[0].indexId ;
                                        secCur.children = [];
                                    }
                                }
                            }
                        }

                        console.log(res.content.titles1,'res.content.titles1')

                        this.title2 = res.content.titles1;
                        this.tableData = res.content.dataList;
                        // res.content.titles.map(item => {
                        //     this.$set(item, "children1", []);
                        //     this.$set(item, "children2", []);
                        //     this.$set(item, "children3", []);
                        // });
                        this.titleList = res.content.titles;
                        // debugger;
                        // this.titleList.map((item, index) => {
                        //     if (
                        //         item.class2 == item.horizonIndexName &&
                        //         item.class2 != item.class1
                        //     ) {
                        //         item.children1.push(item.class2);
                        //     } else if (
                        //         item.class1 != item.class2 &&
                        //         item.class2 != item.horizonIndexName
                        //     ) {
                        //         item.children2.push(item.horizonIndexName);
                        //     }
                        // });
                        // debugger;
                        // console.log(this.titleList, "titleList1");

                        // var titleTop = res.content.titles.map(it => {
                        //     return it.class1;
                        // });

                        // var uniqueTop = that.uniqueArr(titleTop);

                        // var titleFirst = [];
                        // uniqueTop.map(it => {
                        //     var obj = {
                        //         label: it,
                        //         item: []
                        //     };
                        //     titleFirst.push(obj);
                        // });
                        // console.log(titleFirst);
                        // for (var i = 0; i < titleFirst.length; i++) {
                        //     for (var j = 0; j < res.content.titles.length; j++) {
                        //         var cur = res.content.titles[j];
                        //         if (titleFirst[i].label == cur.class1 == cur.class2 == cur.horizonIndexName) {
                        //             titleFirst[j].item = [];
                        //         } else if (titleFirst[i].label == cur.class1 && titleFirst[i].label != cur.class2 &&  cur.class2 == cur.class3) {
                        //             titleFirst[i].item.push({
                        //                 label: cur.class2,
                        //                 item: []
                        //             });
                        //         } else if ( titleFirst[i].label == cur.class1 && titleFirst[i].label != cur.class2 && cur.class2 != cur.class3) {

                        //         }
                        //     }
                        // }
                        // that.title3 = titleFirst;
                        // console.log(titleFirst);
                    }
                    this.tableLoading = false;
                },
                err => {
                    this.tableLoading = false;
                }
            );
        },
        classify() {},
        goBack(){
             this.$router.push({ path: '/budget/downToUpSpace' });
        },
        uniqueArr(arr) {
            let map = new Map();
            console.log(map);
            //let arr1 = new Array();      // 数组用于返回结果
            let arr1 = [];
            for (let i = 0, len = arr.length; i < len; i++) {
                if (map.has(arr[i])) {
                    // 判断是否存在该key值
                    map.set(arr[i], true);
                } else {
                    map.set(arr[i], false);
                    arr1.push(arr[i]);
                }
            }
            return arr1;
        }
    }
};
</script>

<style lang="scss" scoped></style>
